﻿@using EmoneyWeiXinEntity
@{
    Layout = null;
    ThemeEntity entity = ViewBag.CurrentTheme;
    List<Theme_Stock> themeStockLst = ViewBag.StockList;
}

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>@entity.Theme_Name-详细</title>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
    <link href="@Url.Content("~/Static/css/zttz.css")?@(new Random().Next())" rel="stylesheet" />
    <script src="@Url.Content("~/Scripts/jquery-1.8.3.min.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/highcharts.js")"></script>
</head>
<body>
    <header class="header">
        <p class="return">@*<a href="javascript:void(0)" id="back">< 返回</a>*@ @entity.Theme_Name</p>
    </header>
    <!--主题-->
    <div class="theme">
        <!--驱动事件-->
        <dl class="theme_top">
            <dt>驱动事件</dt>
            <dd>@entity.Theme_Info</dd>
        </dl>
        <!--驱动事件end -->
        <!--主题指数-->
        <dl class="theme_zhishu">
            <dt>主题指数</dt>
            <dd class="theme_font">
                <p>
                    <span>日期：<b>@System.DateTime.Now.ToString("MM-dd")</b></span>
                    <span>指数：<b>@((entity.ClosePrice_Now + (entity.ClosePrice_Now * entity.ChangeRatio / 100)).ToString("0.000"))</b></span>
                    <span>涨跌：<b>@(entity.ChangeRatio.ToString("0.00"))%</b></span>
                </p>
            </dd>
            <dd>
                <div class="theme_chart">
                    @*<img src="~/Static/Image/theme_img04.jpg">*@
                </div>
            </dd>
        </dl>
        <!--主题指数 end-->
        <!--相关股票-->
        <dl class="related">
            <dt>相关股票</dt>
            <dd class="related_font">
                <p>
                    <span>名称</span>
                    <span>最新价</span>
                    <span>涨跌幅</span>
                </p>
            </dd>
            <dd>
                <ul>

                    @for (int i = 0; i < themeStockLst.Count; i++)
                    {
                        <li class="gpLi" code="@(themeStockLst[i].SecuCode)" name="@(themeStockLst[i].SecuAbbr)">
                            <div class="related_left">
                                <i></i>
                                <span>
                                    <h4>@(themeStockLst[i].SecuAbbr)</h4>
                                    <b>@(themeStockLst[i].SecuCode)</b>
                                </span>
                            </div>
                            <div class="related_center">
                                <span class="red">@(themeStockLst[i].ClosePrice.Value.ToString("0.00"))</span>
                            </div>
                            <div class="related_right">
                                <span class="@(themeStockLst[i].ChangeRatio.Value > 0 ? "red_bg" : themeStockLst[i].ChangeRatio.Value < 0 ? "green_bg" : "gray_bg")">@(themeStockLst[i].ChangeRatio.Value.ToString("0.00"))%</span>
                            </div>
                        </li>
                    }
                </ul>
                @*<p class="arrows">
                    <a href="#">
                        <img src="~/Static/Image/arrows_img.jpg"></a>
                </p>*@
            </dd>
        </dl>
        <!--相关股票 end-->
    </div>
    <!--主题-->

</body>
</html>

<script type="text/javascript">

    $(function () {

        initEvent();
        var dataArry =
            [
                @entity.HistoryZS
            ];
        var itemArry =
            [
                 @foreach (var item in entity.HistoryDt)
                 {
                     @: '@item',
                 }
            ];

        setHighCharts(itemArry, dataArry);

    });

    function initEvent() {
        $("#back").click(function () {
            window.history.back();
        });

        $(".gpLi").click(function () {
            var code = $(this).attr("code");
            var name = $(this).attr("name");
            window.location.href = "http://app.emoney.cn/Home/Hq?scode=" + code + "&sname=" + name;
        });
    }

    function setHighCharts(itemArry, dataArry) {
        $('.theme_chart').highcharts({
            title: {
                text: null
            },
            subtitle: {
                text: null
            },
            xAxis: {
                categories: itemArry
            },
            yAxis: {
                title: {
                    text: null
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            legend: {
                enabled: false
            },
            tooltip: {
                formatter: function () {
                    var s = '<b>' + this.y + '</b>';
                    //$.each(this.points, function () {
                    //    s += '<br/>' + this.series.name + ': ' +
                    //        this.y;
                    //});
                    return s;
                },
                shared: true
            },
            series: [{
                name: '主题指数',
                color: '#666666',
                data: dataArry
            }],
            credits: {
                enabled: false
            },
            exporting: {
                enabled: false
            }
        });

    }
</script>
